<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <style type="text/css">
      html, body { height: 100%; margin: 0; padding: 0; }
      #map { height: 100%; }
    </style>
    <script type="text/javascript" src="./js/jquery.min.js"></script>
  </head>
  <body>
  
  
    <div id="map"></div>
  
    <script type="text/javascript">
    
    var key = "AIzaSyD2ImjCnIuFAf2G3sf-LYJxBexwa2jWsEo";
    var pos={};
    navigator.geolocation.getCurrentPosition(function(p){
      pos.lat=p.coords.latitude;
      pos.lng=p.coords.longitude;
    var url = "https://maps.google.cn/maps/api/geocode/json?latlng="+pos.lat+","+pos.lng+"&key="+key;
    alert(0)
    /*
    $.getJSON(url,function(res){
      console.log(JSON.stringify(res));
    });
    
    $.ajaxSetup({
      crossDomain:true
    });*/
    var url = "http://47.88.86.30/abcd/b.php?o=中国北京市天安门&d=中国北京市西直门";
    //url = "https://maps.googleapis.com/maps/api/distancematrix/json?origins="+pos.lat+","+pos.lng+"&destinations="+(pos.lat+0.05)+","+(pos.lng+0.05)+"&key="+key;
    $.getJSON(url,function(res){
      alert(JSON.stringify(res));
    });
    alert(1)
    });
    var map;
    function initMap() {
      map = new google.maps.Map(document.getElementById('map'), {
        zoom: 12
      });
      
      var pos = {};
      navigator.geolocation.getCurrentPosition(function(p){
        pos.lat=p.coords.latitude;
        pos.lng=p.coords.longitude;
        map.setCenter(pos);
        
        var url = "https://maps.google.cn/maps/api/geocode/json?latlng="+pos.lat+","+pos.lng+"&key="+key;
        
        $.getJSON(url,function(res){
          console.log(JSON.stringify(res));
        });
        $.ajaxSetup({
          crossDomain:true
        });
        url = "https://maps.google.cn/maps/api/distancematrix/json?origins="+pos.lat+","+pos.lng+"&destinations="+(pos.lat+0.05)+","+(pos.lng+0.05)+"&key="+key;
        //url = "https://maps.googleapis.com/maps/api/distancematrix/json?origins="+pos.lat+","+pos.lng+"&destinations="+(pos.lat+0.05)+","+(pos.lng+0.05)+"&key="+key;
        $.getJSON(url,function(res){
          alert(JSON.stringify(res));
        });
      });
      
    }
    
    


//http://maps.google.cn
//maps.googleapis.com
    </script>
    <!-- 
    <script async defer
      src="http://maps.google.cn/maps/api/js?key=AIzaSyD2ImjCnIuFAf2G3sf-LYJxBexwa2jWsEo&callback=initMap">
    </script>
     -->
  </body>
</html>